@import '~@angular/material/theming';

@mixin nav-menu-theme($theme) {
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);
  $warn: map-get($theme, warn);
  $foreground: map-get($theme, foreground);
  $background: map-get($theme, background);

  .nav-menu-item {
    color: mat-color($foreground, secondary-text);

    &:hover {
      color: mat-color($primary);
      background-color: mat-color($background, hover);
    }
  }
  .nav-menu-item.selected {
    color: mat-color($primary);
  }
  button.nav-menu-item {
    &:focus {
      color: mat-color($foreground, base);
    }
  }

  .heading {
    color: mat-color($foreground, text);
  }
  .level-2 {
    color: mat-color($foreground, hint-text);
  }
  .level-3 {
    color: mat-color($foreground, hint-text);
  }
}
